<!DOCTYPE html>
<html lang="zh-cn">
<head>
  <meta charset='UTF-8'>
  <meta name='viewport' content='width=device-width, initial-scale=1'>
  <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate"/>
  <meta http-equiv="Pragma" content="no-cache"/>
  <meta http-equiv="Expires" content="0"/>
  <title>江苏联通全业务加速</title>
  <link rel="stylesheet" href="css/dialog.css">
  <link rel="stylesheet" href="css/style.css">
</head>
<body>
<div id="app" class="app" v-cloak>
  <div class="bg">
    <img src="img/bg.png" alt="bg">
  </div>
  <div class="content">
    <div v-show="currentPage === 1" class="page1">
      <div class="title"><span>江苏联通</span><span>全业务加速</span></div>
      <div class="info-box">
        <span class="info">全业务加速是江苏联通新上线的一个业务,是专门针对视频/直播/导航/拼购等多样化加速场景，可为用户打造专属VIP网络通道，上网速率平均提升4倍以上，从而解决用户在核心区域无法实时传输图片、视频以及无法刷新网页等网络卡顿、不顺畅等问题。</span>
        <div class="btn">
          <span @click="goUser()">点击领取全业务加速体验包</span>
        </div>
      </div>
    </div>
    <div v-show="currentPage === 2" class="page2">
      <span class="title">江苏联通全业务加速体验包</span>
      <div class="info-box">
        <div class="info-list">
          <span class="info-count">您本次可享受：</span>
          <div class="info-times">
            <div class="info-row">
              <span><b>30</b>次</span>
              <span><b>120</b>分钟</span>
            </div>
            <div class="info-row">
              <span>免费全业务加速体验</span>
              <span>&</span>
              <span>每次加速时长</span>
            </div>
            <div class="info-tips">
              <span>本业务支持所有应用，登录后即可享受加速体验！</span>
            </div>
            <div class="info-btn" @click="goLogin()">
              <span>去登陆</span>
            </div>
          </div>
        </div>
      </div>
      <div class="info-box" style="height: 76vw">
        <div class="info-list">
          <div class="info-title">
            <img src="img/img_title_left.png" alt="">
            <span>江苏联通游戏加速器</span>
            <img src="img/img_title_right.png" alt="">
          </div>
          <div class="info-more">
              <span>江苏联通专门为手游加速的“江苏联通游戏加速器APP”也已经上线了！ <br>
小伙伴们可以用扫描二维码的方式关注小程序或下载APP进行加速体验。</span>
          </div>
          <div class="info-icon">
            <div>
              <img src="img/mini.svg" alt="">
              <span>小程序</span>
            </div>
            <div>
              <img src="img/ty_img_app.png" alt="">
              <span>APP</span>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div v-show="currentPage === 3" class="page3">
      <div class="active-status">
        <div class="status-time">
          <img src="img/ty_img_app.png" alt="">
          <div>
            <span class="status-left">剩余免费体验次数 <b>{{ times }}</b> 次</span>
            <div class="status">
              <span class="in-progress"><i></i>加速中</span>
              <span class="progress-time">{{ timeStart }}</span>
            </div>
          </div>
        </div>
        <div class="net-status">
          <div class="net">
            <div class="net1">
              <img src="img/net1.png" alt="">
              <span>网络延迟</span>
            </div>
            <div class="net2">
              <span><b>{{ ping.delay }}</b>ms</span>
            </div>
          </div>
          <div class="net">
            <div class="net1">
              <img src="img/net2.png" alt="">
              <span>综合提升</span>
            </div>
            <div class="net2">
              <span><b>{{ ping.up }}</b>%</span>
            </div>
          </div>
          <div class="net">
            <div class="net1">
              <img src="img/net3.png" alt="">
              <span>丢包率</span>
            </div>
            <div class="net2">
              <span><b>{{ ping.lost }}</b>%</span>
            </div>
          </div>
        </div>
        <div class="net-icon">
          <img src="img/img_ch.png" alt="">
        </div>
        <div class="net-btn" @click="stopActive()">
          <span>停止加速</span>
        </div>
        <div class="net-info">
          <span>《江苏联通全业务加速用户协议》</span>
        </div>
      </div>
    </div>
    <div v-show="currentPage === 4" class="page4">
      <div class="active-status">
        <div class="status-time">
          <img src="img/ty_img_app.png" alt="">
          <div>
            <span class="status-left" style="font-size: 15px">剩余免费体验次数 <b
              style="font-size: 24px;">{{ times }}</b> 次</span>
            <span class="status-left" style="font-size: 15px">每次体验时长 <b style="font-size: 24px;">120</b> 分钟</span>
            <div class="status no-status">
              <span class="in-progress"><i></i>未加速</span>
            </div>
          </div>
        </div>
        <div class="net-status">
          <div class="net">
            <div class="net1">
              <img src="img/net1.png" alt="">
              <span>网络延迟</span>
            </div>
            <div class="net2">
              <span><b>--</b></span>
            </div>
          </div>
          <div class="net">
            <div class="net1">
              <img src="img/net2.png" alt="">
              <span>综合提升</span>
            </div>
            <div class="net2">
              <span><b>--</b></span>
            </div>
          </div>
          <div class="net">
            <div class="net1">
              <img src="img/net3.png" alt="">
              <span>丢包率</span>
            </div>
            <div class="net2">
              <span><b>--</b></span>
            </div>
          </div>
        </div>
        <div class="net-choose">
          <div @click="goActive()">
            <img src="img/btn1.png" alt="">
          </div>
          <div @click="goSub()">
            <img src="img/btn2.png" alt="">
          </div>
        </div>
        <div class="net-info">
          <span>《江苏联通全业务加速用户协议》</span>
        </div>
      </div>
    </div>
  </div>
</div>
<script src="https://pv.sohu.com/cityjson?ie=utf-8"></script>
<script src="js/zepto.min.js"></script>
<script src="js/dialog.js"></script>
<script src="js/vue.min.js"></script>
<script>
  (function () {
    var pingTM = null;
    $.ping = function (option) {
      var ping, requestTime, responseTime;
      var getUrl = function (url) {    //保证url带http://
        var strReg = '^((https|http)?://){1}';
        var re = new RegExp(strReg);
        return re.test(url) ? url : 'http://' + url;
      };
      $.ajax({
        url: 'http://sp1.baidu.com/5bU_dTmfKgQFm2e88IuM_a/w.gif?t=' + new Date().getTime(),  //设置一个空的ajax请求
        type: 'GET',
        dataType: 'html',
        timeout: 10000,
        beforeSend: function () {
          if (option.beforePing) option.beforePing();
          requestTime = new Date().getTime();
        },
        complete: function () {
          responseTime = new Date().getTime();
          ping = Math.abs(requestTime - responseTime);
          if (option.afterPing) option.afterPing(ping);
        }
      });

      if (option.interval && option.interval > 0) {
        var interval = option.interval * 1000;
        pingTM = setTimeout(function () {
          $.ping(option);
        }, interval);
//        option.interval = 0;        // 阻止多重循环
//        setInterval(function(){$.ping(option)}, interval);
      }
    };

    new Vue({
      el: '#app',
      data: {
        currentPage: 1,
        clientIp: null,
        phone: localStorage.getItem('phone') || null,
        correlationId: null,
        timeStart: '00:00:00',
        tm: null,
        times: localStorage.getItem('times'),
        ping: {
          delay: '',
          up: '',
          lost: 0
        }
      },
      methods: {
        goPage(index) {
          this.currentPage = index;
        },
        checkUser() {
          this.goPage(1);
        },

        checkStatus() {
          var oldTime = localStorage.getItem('currentTime') || '';
          this.correlationId = localStorage.getItem('correlationId') || '';
          if (oldTime && this.correlationId) {
            var that = this;
            var newTime = new Date().getTime();
            if (newTime - parseInt(oldTime) > 7200 * 1000) {
              $.ajax({
                url: 'http://116.147.0.36:8090/ivsp/services/AACAPIV1/removeTecentGamesQoSTest/' + that.correlationId,
                type: 'GET',
                xhrFields: {withCredentials: false},
                success: function (data) {
                  if(typeof data !== 'object'){
                    data = JSON.parse(data);
                  }
                  if (data && data.ResultCode === 0) {
                    that.tm && clearInterval(that.tm);
                    that.timeStart = '00:00:00';
                    pingTM && clearTimeout(pingTM);
                    localStorage.setItem('correlationId', '');
                    that.goPage(4);
                  } else {
                    that.showNotice(data ? data.ResultMessage : '操作失败');
                  }
                },
                error: function (err) {
                  // that.showNotice(err ? err.message : '发送失败');
                }
              });
            } else {
              that.goPage(3);
              that.startTime();
              that.pingRequest();
            }
          } else {
            this.goPage(4);
          }
        },

        goUser() {
          if (this.phone) {
            this.checkStatus();
          } else {
            this.goPage(2);
          }
        },
        goLogin() {
          window.location.href = 'login.html';
        },
        goActive() {
          var that = this;
          if (parseInt(this.times) === 0) {
            this.showLessTimes();
            return false;
          }
          if (this.phone) {
            $.ajax({
              url: 'http://js4gqos.h2comm.com.cn:8090/ivsp/services/AACAPIV1/applyTecentGamesQoS',
              type: 'POST',
              contentType: 'application/json',
              xhrFields: {withCredentials: false},
              data: JSON.stringify({
                'NetInformation': {
                  'RSRP': '',
                  'eNBCode': ''
                },
                'Partner_ID': 'jsgamesH5',
                'Duration': 1800,
                'ServiceId': 'Video2M',
                'ResourceFeatureProperties': [
                  {
                    'Type': 1,
                    'MinimumDownStreamSpeedRate': 2000000,
                    'Priority': 15,
                    'FlowProperties': [
                      {
                        'SourceIpAddress': '1.1.1.1',
                        'Protocol': 'IP',
                        'MaximumDownStreamSpeedRate': 2000000,
                        'DestinationIpAddress': '0.0.0.0',
                        'Direction': 2,
                        'MaximumUpStreamSpeedRate': 2000000
                      }
                    ],
                    'MinimumUpStreamSpeedRate': 2000000
                  }
                ],
                'OTTchargingId': '4572620319703092fggg8',
                'security_token': '',
                'UserIdentifier': {
                  'IP': '1.1.1.1',
                  'PublicIP': returnCitySN['cip'],
                  'MSISDN': that.phone,
                  'IMSI': '460011605393493'
                }
              }),
              success: function (data) {
                if(typeof data !== 'object'){
                  data = JSON.parse(data);
                }
                if (data && data.ResultCode === 0) {
                  $(document).dialog({
                    titleShow: false,
                    content: '加速成功',
                  });
                  that.getResult(data);
                } else {
                  that.showNotice(data.ResultMessage || '加速失败');
                }
              },
              error: function (err) {
                  that.showNotice('加速失败');
              }
            });
          }
        },

        getResult(data) {
          localStorage.setItem('beginTime', 0);
          this.goPage(3);
          this.correlationId = data.CorrelationId;
          this.startTime();
          this.pingRequest();
          this.times--;
          localStorage.setItem('times', this.times);
          localStorage.setItem('currentTime', new Date().getTime().toString());
          localStorage.setItem('correlationId', this.correlationId);
          this.showLessTimes();
        },

        showLessTimes() {
          var tipsMsg = '';
          if (this.times > 0 && this.times <= 5) {
            tipsMsg = '您的免费体验次数已不足5次，为了避免您的正常使用，请您及时订购，也可下载江苏联通游戏加速器APP或小程序订购，感谢您的使用。';
          } else if (this.times == 0) {
            tipsMsg = '您的免费体验次数已用尽，请您及时订购，也可下载江苏联通游戏加速器APP或小程序订购，感谢您的使用。';
          } else {
            tipsMsg = '';
          }
          if (tipsMsg) {
            $(document).dialog({
              type: 'confirm',
              titleShow: false,
              style: 'ios',
              content: tipsMsg,
              buttonTextConfirm: '下载APP',
              buttonTextCancel: '好的',
              onClickConfirmBtn: function () {
                //跳转链接
                console.log(333);
              }
            });
          }
        },

        stopActive() {
          var that = this;
          that.correlationId = localStorage.getItem('correlationId') || '';
          $(document).dialog({
            type: 'confirm',
            titleShow: false,
            style: 'ios',
            content: '停止加速后，应用可能会断线，您确定停止加速吗？',
            buttonTextConfirm: '确定',
            buttonTextCancel: '取消',
            onClickConfirmBtn: function () {
              if (that.correlationId) {
                $.ajax({
                  url: 'http://js4gqos.h2comm.com.cn:8090/ivsp/services/AACAPIV1/getRemoveTecentGamesQoS?correlationId='+that.correlationId+'&publicIP={correlationId}&Partner_ID={correlationId}',
                  type: 'GET',
                  xhrFields: {withCredentials: false},
                  success: function (data) {
                    if (data && data.ResultCode === 0) {
                      that.tm && clearInterval(that.tm);
                      that.timeStart = '00:00:00';
                      pingTM && clearTimeout(pingTM);
                      localStorage.setItem('beginTime', 0);
                      localStorage.setItem('correlationId', '');
                      that.goPage(4);
                    } else {
                      that.showNotice(data ? data.ResultMessage : '操作失败');
                    }
                  },
                  error: function (err) {
                    that.showNotice('操作失败');
                  }
                });
              }else {
                that.showNotice('缺少correlationId');
              }
            }
          });
        },
        startTime() {
          var beginTime = localStorage.getItem('beginTime') || 0;
          var that = this;
          this.tm = setInterval(function () {
            beginTime++;
            localStorage.setItem('beginTime', beginTime);
            var date = new Date(0, 0);
            date.setSeconds(beginTime);
            var h = date.getHours(), m = date.getMinutes(), s = date.getSeconds();
            that.timeStart = that.formatNum(h) + ':' + that.formatNum(m) + ':' + that.formatNum(s);
          }, 1000);
        },

        formatNum(num) {
          return num >= 10 ? num : '0' + num;
        },

        showNotice(text) {
          $(document).dialog({
            type: 'notice',
            style: 'ios',
            infoText: text,
            autoClose: 3000,
            position: 'center'
          });
        },
        pingRequest() {
          var that = this;
          $.ping({
            url: 'http://www.baidu.com',
            beforePing: function () {
            },
            afterPing: function (ping) {
              that.ping.delay = ping;
              that.ping.up = Math.floor((2000 - ping) / 2000 * 100);
            },
            interval: 5
          });
        },
        goSub(){
          var tel = localStorage.getItem('phone') || '';
          window.location.href = 'http://jsgames.kgogogo.com?telephone='+ tel;
        }
      },
      mounted() {
        var that = this;
        // getIPs(function (ip) {
        //   // that.clientIp = "'"+ip+"'" || '0.0.0.0';
        //   that.clientIp = ip || '0.0.0.0';
        //   that.showNotice('publicIp='+that.clientIp +'\n'+'netIp=' +window['netIp']);
        // });
        // that.clientIp = window['publicIp'] || '0.0.0.0';
        // that.showNotice('publicIp=' + that.clientIp + '\n' + 'netIp=' + window['netIp']);
        this.checkUser();
      }
    });
  })();
</script>
</body>
</html>
